import Vue from 'vue'
export default {
  install () {
    Vue.directive('iptfocus', {
      inserted (el) { // 指令被插入真实dom的话,inserted 只会执行一次,之后进行css隐藏和显示
        // el是指令所在的标签
        // 必须对el进行判断 nodeName属性
        // 如果el本身就是input或者textare
        // 如果以上两种都没找到==需要我们声明一个变量进行兜底
        mydir(el)
      },
      update (el) { // 指令所在标签更新后显示隐藏时执行这个方法
        mydir(el)
      }
    })
  }
}

function mydir (el) {
  let unfind = false
  if (el.nodeName === 'INPUT' || el.nodeName === 'TEXTAREA') {
    el.focus()
    unfind = true
  } else {
    // 如果el本身不是,需要往下面去找
    const ipt = el.querySelector('input')
    const tx = el.querySelector('textarea')
    if (ipt && ipt.nodeName === 'INPUT') {
      // ipt不是空,才能往后执行
      ipt.focus()
      unfind = true
    }
    if (tx && tx.nodeName === 'TEXTAREA') {
      // tx不是空才往下执行
      tx.focus()
      unfind = true
    }
  }
  if (unfind === false) {
    throw new Error('没有找到可以聚焦的dom节点')
  }
}
